import { createPinia } from 'pinia'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import { mount, type VueWrapper } from '@vue/test-utils'
import { createRouter, createWebHistory, type Router, type RouteRecordRaw } from 'vue-router'

export interface MountOptions {
  initialRoutes?: Array<RouteRecordRaw>
  routePath?: string
  global?: any
  props?: Record<string, any>
}

export async function mountWithPlugins(component: any, options: MountOptions = {}): Promise<{ wrapper: VueWrapper<any>; router: Router }>
{
  const pinia = createPinia()

  const router = createRouter({
    history: createWebHistory(),
    routes: options.initialRoutes || [
      { path: '/', component: { template: '<div />' } },
      { path: '/login', component: { template: '<div />' } },
      { path: '/register', component: { template: '<div />' } },
    ],
  })

  const wrapper = mount(component, {
    props: options.props,
    global: {
      plugins: [pinia, router, ElementPlus],
      stubs: {
        VChart: { template: '<div />' },
      },
      ...(options.global || {}),
    },
  })

  // ensure router is ready and navigate if a path was provided
  await router.isReady()
  if (options.routePath) {
    await router.push(options.routePath)
  }

  return { wrapper, router }
}
